<template>
  <lay-container fluid="true" style="padding: 10px">
    <lay-row :space="10">
      <lay-col :md="24">
        <lay-field title="部门列表">
          <lay-tree :data="treeData" collapse-transition @node-click="handleClick" :onlyIconControl="true">
          </lay-tree>
        </lay-field>
      </lay-col>
    </lay-row>
  </lay-container>
</template>

<script lang="ts" name="DeptTree" setup>
import { ref } from "vue";
import { getDeptListTree } from "../../../../api/module/user/user";
const treeData = ref([])
getDeptListTree().then((res) => {
  if (res.status == 1) {
    treeData.value = res.data.data
  }
})
// 与父组件的交互逻辑
const emits = defineEmits(['node-click']);
const handleClick = (node: any) => {
  emits('node-click', { id: node.id, name: node.name });
}
</script>
<style scoped>

</style>